Add --bs-*-rgb variable overrides for Bootstrap 5.3 utility classes#813
Conversation
|
Review finding: [P1] Preset color schemes still ship Bootstrap's default These overrides are only emitted inside Relevant code:
|
|
Fixed in beb654b. Added |
Bootstrap 5.3 utility classes like .text-primary, .bg-primary, and .border-primary use the -rgb triplet form of CSS custom properties (e.g. --bs-primary-rgb: 13, 110, 253) rather than the hex form (--bs-primary). We overrode the hex variants but none of the 19 -rgb variants, causing these utilities to ignore the theme palette. Generate --bs-*-rgb companions from palette hex values using the existing Color::hexToRgb() utility. Fixes #812
The previous commit added -rgb variable generation for the custom palette (PHP-generated CSS) but preset schemes defined in SCSS were still missing them. Bootstrap 5.3 utility classes like .text-primary and .bg-primary consume the -rgb triplet form, so preset schemes like aivibe, brighthealthy, etc. also need these overrides. Generate --bs-*-rgb variables from Sass color values inside the @each scheme loop alongside the existing header-rgb extraction. Fixes #812
Use multi-line } @else if { format to satisfy both at-rule-empty-line-before and scss/at-else-closing-brace rules.
jjroelofs
force-pushed
the
jur/8.x/812-add-bs-rgb-variable-overrides
branch
from
1815ff7 to
f2b1dad
Compare
1 participant
Linked issues
Solution
Bootstrap 5.3 utility classes (
.text-primary,.bg-primary,.border-primary,.link-primary,.focus-ring-primary, etc.) consume the-rgbtriplet form of CSS custom properties viargba(), not the hex form. For example:We were overriding
--bs-primary(hex) but not--bs-primary-rgb(triplet), so these utility classes ignored the theme palette entirely. This adds generation of all 11--bs-*-rgbvariables from palette hex values using the existingColor::hexToRgb()utility already imported in the file.Scope of affected files:
features/sooper-colors/colors-theme-settings-css.inconly.Checklist